<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
    <title>亿人宝 - 开通第三方支付</title>
    <meta content="" name="keywords"/>
    <meta content="" name="description"/>
    <link rel="stylesheet" th:href="@{/css/common.css}"/>
    <link rel="stylesheet" th:href="@{/css/user.css}" type="text/css"/>
    <link rel="stylesheet" th:href="@{/css/jquery.datetimepicker.css}" type="text/css"/>
    <script th:src="@{/script/jquery.min.js}" type="text/javascript"></script>
    <script th:src="@{/script/common.js}" type="text/javascript"></script>
    <script th:src="@{/script/user.js}" type="text/javascript"></script>
    <script th:src="@{/layui/layer/layer.js}" type="text/javascript"></script>
</head>
<body>
<div th:replace="common/public::head"></div>
<!--个人中心-->
<div class="wrapper wbgcolor">
    <div class="w1200 personal">
        <!--<div class="credit-ad"><img height="96" th:src="@{/images/clist1.jpg}" width="1200"></div>-->
        <div class="personal-left" id="personal-left">
            <ul>
                <li><span><a th:href="@{/per/index(option = 1)}"><i class="dot dot1"></i>账户总览</a></span></li>
                <li><span><a style="font-size:14px;text-align:center;width:115px;padding-right:35px;" th:href="@{/cap/cap_List}">资金记录</a></span></li>
                <li><span><a style="font-size:14px;text-align:center;width:115px;padding-right:35px;" th:href="@{/per/investlist(option = 1)}">投资记录</a></span>
                </li>
                <li><span><a style="font-size:14px;text-align:center;width:115px;padding-right:35px;" th:href="@{/per/prolist}">回款计划</a></span></li>
                <li class="pleft-cur"><span><a th:href="@{/per/thirdparty}"><i class="dot dot02"></i>开通第三方</a> </span></li>
                <li><span><a th:href="@{/per/torecharge}"><i class="dot dot03"></i>充值</a></span></li>
                <li class=""><span><a th:href="@{/per/towithdrawal}"><i class="dot dot04"></i>提现</a></span></li>
                <li class="" style="position:relative;"><span> <a th:href="@{/per/toredenvelopes(state = 1)}"> <i class="dot dot06"></i> 我的红包 </a> </span></li>
                <li style="position:relative;"><span> <a th:href="@{/per/tomessages}"><i class="dot dot08"></i>系统信息 </a> </span></li>
                <li><span><a th:href="@{/setUser/toView}"><i class="dot dot09"></i>账户设置</a></span></li>
            </ul>
        </div>
        <style>
            /*获取验证码*/
            a.hqyzm {
                float: left;
                background: #ea524a;
                width: 125px;
                height: 35px;
                line-height: 35px;
                font-size: 14px;
                margin-left: 6px;
                text-align: center;
                color: #fff;
                border-radius: 2px;
            }

            a.hqyzm:hover {
                color: #fff;
                background: #ff8882;
            }

            /*获取验证码后在倒计时中的样式*/
            a.hqyzmAfter {
                float: left;
                background: #c0c0c0;
                width: 125px;
                height: 35px;
                line-height: 35px;
                font-size: 14px;
                margin-left: 6px;
                text-align: center;
                color: #fff;
                border-radius: 2px;
            }
        </style>
        <div class="personal-main">
            <div class="personal-pay">
                <h3><i>开通第三方账户</i></h3>
                <form method="post" onsubmit="return add()" th:action="@{/per/addidentitycard}">
                    <div class="pay-notice">
                        <p>开通第三方资金托管账户的信息将提交至<a href="https://www.alipay.com/" target="_blank">支付宝</a>网站执行，</p>
                        <p><a href="https://www.alipay.com/" target="_blank">支付宝</a>系统将为您分配唯一用户ID（格式为：TG_用户名），并与您亿人宝账户自动绑定，您无需修改和记忆。 </p>
                    </div>
                    <div class="pay-form" th:if="${thi == null}">
                        <h6>请输入您的身份证信息</h6>
                        <ul>
                            <input name="uid" th:value="${session.user.id}" type="hidden"/>
                            <li>
                                <label>真实姓名</label>
                                <input class="pay-txt" id="name" maxlength="16" name="name" placeholder="您的真实姓名" type="text">
                                <div id="realnameErrorDiv">
                                    <span id="namespan" style="margin-top:10px;"></span>
                                </div>
                            </li>
                            <li>
                                <label>身份证号</label>
                                <input class="pay-txt" id="identitycard" maxlength="18" name="identitycard" placeholder="您的身份证号" type="text">
                                <div id="idCardErrorDiv">
                                    <span id="identitycardspan" style="line-height: 38px;">身份证信息认证后将不可修改，请您仔细填写</span>
                                </div>
                            </li>
                            <li>
                                <label>支付密码</label>
                                <input class="pay-txt" id="Paymentpassword" maxlength="6" name="pwd" onkeyup="value=value.replace(/[^\d\.]/g,'')"
                                       placeholder="您的支付密码" type="password">
                                <div id="isdCardErrorDiv">
                                    <span id="Paymentpasswordspan" style="line-height: 38px;"></span>
                                </div>
                            </li>
                        </ul>
                        <h6>邮箱已绑定</h6>
                        <ul>
                            <li>
                                <label>邮箱</label>
                                <label id="form:email" th:text="${email}"> 348****@qq.com</label>
                            </li>
                        </ul>
                        <h6>手机号已绑定</h6>
                        <ul>
                            <li>
                                <label>手机号</label>
                                <label th:text="${phone}"> 150****0139</label>
                            </li>
                            <li>
                                <input class="btn-paykh" name="" style="border:none;" type="submit" value="开户">
                            </li>
                        </ul>
                    </div>
                    <div class="pay-form" style="height: 340px;" th:if="${thi != null}">
                        <img style="margin-left: 295px" th:src="@{/images/duigou.png}"/>
                        <div>
                            <span style="margin-left: 320px;">您已开通第三方支付！</span>
                        </div>
                    </div>
                </form>
                <div class="pay-tipcon"> 1、为切实保障投资人的利益，亿人宝将理财资金托管在<a href="https://www.alipay.com/" target="_blank">支付宝第三方支付</a>平台。平台是2012年6月获批中国人民银行支付许可证和中国证监会基金支付许可的第三方支付公司，在金融支付领域业界领先地位。详情请登录<a
                        href="https://www.alipay.com/" target="_blank">支付宝</a>官方网站查看。<br>
                    2、根据相关法律规定，亿人宝在开通资金托管账户时，需要验证您的身份信息。该信息一经设置，无法修改，请慎重选择。为了确保您可以顺利提现，请确认您拥有一张使用该身份证开户的有效储蓄卡。<br>
                    3、亿人宝将最大限度的尊重和保护您的个人隐私，详情请阅读<a href="#" target="_blank">《亿人宝隐私条款》</a>。<br>
                    4、您在开通第三方账号过程中，如有遇到问题，可以查看理财帮助，也可以联系我们的客服进行咨询，咨询电话：400-999-8850。
                </div>
            </div>
        </div>
        <div class="clear"></div>
    </div>
</div>
<!--网站底部-->
<div class="ft" id="footer">
    <div th:replace="common/public::footer"></div>
</div>
<script type="text/javascript">
    var first = false;
    var second = false;
    var third = false;

    function verification() {
        var name = $("#name").val().trim();
        var names = "^[a-zA-Z\u4e00-\u9fa5]+$";
        var ex = new RegExp(names);
        if (!name | name == null) {
            first = false;
            $("#namespan").html("");
            $("#namespan").html("<span style='color:#ff7800; line-height: 38px;'>姓名不能为空</span>");
        } else if (name.search(ex) != -1) {
            first = true;
            $("#namespan").html("");
            $("#namespan").html("<span style='color:green; line-height: 38px;'>格式正确</span>");
        } else {
            first = false;
            $("#namespan").html("");
            $("#namespan").html("<span style='color:#ff7800; line-height: 38px;'>姓名只能输入中文、英文</span>");
        }
    }

    function verification2() {
        var identitycard = $("#identitycard").val().trim();
        var cardId = /^[1-9][0-9]{5}(19|20)[0-9]{2}((01|03|05|07|08|10|12)(0[1-9]|[1-2][0-9]|31)|(04|06|09|11)(0[1-9]|[1-2][0-9]|30)|02(0[1-9]|[1-2][0-9]))[0-9]{3}([0-9]|x|X)$/;
        if (!identitycard | identitycard == null) {
            second = false;
            $("#identitycardspan").html("");
            $("#identitycardspan").html("<span style='color:#ff7800; line-height: 38px;'>身份证号不能为空</span>");
        } else if (cardId.test(identitycard)) {
            second = true;
            $("#identitycardspan").html("");
            $("#identitycardspan").html("<span style='color:green; line-height: 38px;'>格式正确</span>");
        } else {
            second = false;
            $("#identitycardspan").html("");
            $("#identitycardspan").html("<span style='color:#ff7800; line-height: 38px;'>身份证号格式不正确</span>");
        }
    }

    function verification3() {
        var Paymentpassword = $("#Paymentpassword").val().trim();
        if (!Paymentpassword | Paymentpassword == null) {
            third = false;
            $("#Paymentpasswordspan").html("");
            $("#Paymentpasswordspan").html("<span style='color:#ff7800; line-height: 38px;'>支付密码不能为空</span>");
        } else if (Paymentpassword.length != 6) {
            third = false;
            $("#Paymentpasswordspan").html("");
            $("#Paymentpasswordspan").html("<span style='color:#ff7800; line-height: 38px;'>支付密码必须为6为数字</span>");
        } else {
            third = true;
            $("#Paymentpasswordspan").html("");
            $("#Paymentpasswordspan").html("<span style='color:green; line-height: 38px;'>信息可用</span>");
        }
    }

    $("#name").blur(function () {
        verification();
    });
    $('#identitycard').blur(function () {
        verification2();
    });
    $('#Paymentpassword').blur(function () {
        verification3();
    });

    function add() {
        if (!first | !second | !third) {
            layer.msg('请完善信息！', {
                icon: 5
            });
        } else if (first & second & third) {
            return true;
        }
        return false;
    }
</script>
</body>
</html>
